<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>edit_address</title>
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <style>
   
        .edit {
            display: flex;
            flex-direction: column;
            height: 100%;
            background-color: #f6f6f6;
        }

        .edit-topform {
            padding: 0 15px;
            background-color: white;
        }

        .edit-topform-item {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            height: 51px;
            border-top: 1px solid #f8f8f8;
        }

        .edit-topform-text {
            font-size: 16px;
            color: #333333;
        }

        .edit-topform-input {
            width: 210px;
            height: 30px;
            text-align: right;
            color: #333333;
            border: none;
        }

 
        /* btn */
        .edit-footer {
            display: flex;
            flex-direction: row;
            padding: 15px;
        }

        .edit-btn {
            flex: 1;
            height: 45px;
            border-radius: 4px;
            font-weight: bold;
            text-align: center;
            line-height: 45px;
            font-size: 16px;
            color: white;
        }

        .edit-btn:active {
            opacity: 0.7;
        }

        .btn_orange {
            background-color: #339dff;
            margin-right: 15px;
        }

        .btn_red {
            background-color: #ff6600;
        }

        .avm-switch:checked::before {
            -webkit-transform: scale(0);
            transform: scale(0);
        }
        .avm-switch:checked::after {
            -webkit-transform: translateX(20px);
            transform: translateX(22px);
        }

        .avm-switch {
            width: 52px;
            height: 32px;
            display: inline-block;
            border: 1px solid #DFDFDF;
            outline: none;
            border-radius: 16px;
            box-sizing: border-box;
            background-color: #DFDFDF;
            transition: background-color 0.1s, border 0.1s;
            -webkit-appearance: none;
            appearance: none;
            position: relative;
            vertical-align: middle;
            background-color: rgb(4, 190, 2);
        }

        .avm-switch::before {
            content: " ";
            position: absolute;
            top: 0;
            left: 0;
            width: 50px;
            height: 30px;
            border-radius: 15px;
            background-color: #f6f6f6;
            transition: -webkit-transform 0.3s;
            transition: transform 0.3s;
            transition: transform 0.3s, -webkit-transform 0.3s;
        }

        .avm-switch::after {
            content: " ";
            position: absolute;
            top: 0;
            left: 0;
            width: 30px;
            height: 30px;
            border-radius: 15px;
            background-color: #FFFFFF;
            box-shadow: 0 1px 3px rgb(0 0 0 / 40%);
            transition: -webkit-transform 0.3s;
            transition: transform 0.3s;
            transition: transform 0.3s, -webkit-transform 0.3s;
        }
        .userface { max-height: 100px; max-width: 100px; border-radius: 4px; border:1px solid #e8e8e8; }
    </style>
</head>

<body>
    <div class="page">
        <div class="nav-bar">
            <div onclick="core.back()" class="nav-bar-back">
                <span class="icon iconfont icon-fanhui m_r_10"></span>
                <span class="nav-bar-back-text">返回</span>
            </div>
            <span class="nav-bar-title"></span>
        </div>
        <div class="edit">
            <div class="edit-topform editpass hide p20">
                <div class="edit-topform-item">
                    <span class="edit-topform-text">原密码</span>
                    <input class="edit-topform-input formpass0" placeholder="请填写旧密码"
                        maxlength="20" />
                </div>
                <div class="edit-topform-item">
                    <span class="edit-topform-text">新密码</span>
                    <input class="edit-topform-input formpass1" placeholder="请填写新密码"
                        maxlength="20" />
                </div>
                <div class="edit-topform-item">
                    <span class="edit-topform-text">请确认</span>
                    <input class="edit-topform-input formpass2" placeholder="请确认新密码"
                        maxlength="20" />
                </div>
            </div>


            <div class="edit-topform edituser hide p20">
                <!-- <div class="edit-topform-item" style="height: 110px;">
                    <span class="edit-topform-text">头像</span>
                   <img class="userface" onclick="editFace()" />
                </div> -->
                <div class="edit-topform-item">
                    <span class="edit-topform-text ">昵称</span>
                    <input class="edit-topform-input nname " placeholder="请填写昵称"
                        maxlength="20" />
                </div>
                <div class="edit-topform-item">
                    <span class="edit-topform-text">真实姓名</span>
                    <input class="edit-topform-input cname" placeholder="请填写真实姓名"
                        maxlength="20" />
                </div>
                <div class="edit-topform-item">
                    <span class="edit-topform-text">支付宝</span>
                    <input class="edit-topform-input ali" placeholder="请填写支付宝"
                        maxlength="20" />
                </div>
                <div class="edit-topform-item">
                    <span class="edit-topform-text">地址</span>
                    <input class="edit-topform-input addr" placeholder="请填写地址"
                        maxlength="20" />
                </div>
            </div>
            <!-- 备注 -->
            

            <!-- btn -->
            <div class="flex1"></div>
            <div class="edit-footer">
                <span class="edit-btn btn_orange  " onclick="fnSubmit(this)">提交</span>
        
               
            </div>
        </div>
    </div>
</body>

<script src="../script/api.js"></script>
<script src="../script/common.js"></script>
 
<script>
        var htmldata={
         action :"",
         address:"",
         dt :{ id :0 }
      };

    apiready = function () {
        $api.fixStatusBar($api.dom('.nav-bar'));
        let  action  = core.getParam("action");
        htmldata.action = action;
        if(action == "edit"){
            initUinfo();
            $api.html(   $api.dom(".nav-bar-title") ,"设置资料");
            $api.removeCls( $api.dom(".edituser"),"hide"  );
            return;
        }
        if(action == "pass"){
            $api.html(   $api.dom(".nav-bar-title") ,"设置密码");
            $api.removeCls( $api.dom(".editpass"),"hide"  );
            return;
        }
        
    }

 

   async   function fnSubmit() {
       if(htmldata.action=="pass"){
           let pass0 =  $api.trim(  $api.val($api.dom('.formpass0')) );
           let pass1 =   $api.trim(  $api.val($api.dom('.formpass1')));
           let pass2 =   $api.trim(  $api.val($api.dom('.formpass2')));
           if(pass0.length<6){
               core.toast("请填写原密码,密码最少6位")
               return;
           }
           if(pass1.length<6){
               core.toast("请填写新密码,密码最少6位")
               return;
           }
           if(pass0==pass1){
               core.toast("新密码与原密码相同.")
               return;
           }
           if(pass1!=pass2){
               core.toast("两次密码输入不同,请确认")
               return;
           }
           var dt = {pass0 , pass1 };

            api.alert({
                        msg:'密码更改成功.'
                });
                core.back();
            return; 

           let   rt  =  await   core.post("app/setUserPass",dt ,{} );
           core.log(rt);
            if(rt.code ==400){
                api.alert({
                        msg:'原密码错误'
                });
                return; 
            }  
            if(rt.code ==200){
                api.alert({
                        msg:'密码更改成功.'
                });
                core.back();
                return; 
            } 
           return;
       }

       if(htmldata.action=="edit"){
         
            let addr =  $api.trim(  $api.val($api.dom('.addr')) );
            let ali =  $api.trim(  $api.val($api.dom('.ali')) );
            let nname  =  $api.trim(  $api.val($api.dom('.nname')) );
            let cname  =  $api.trim(  $api.val($api.dom('.cname')) );
            let dt  = {addr , ali , nname , cname };
            core.log(dt);
            let   rt  =  await   core.post("app/setUserEdit",dt ,{} );
            core.log(rt);
        

            api.alert({
                        msg:'用户资料设置成功.'
                });
                
                core.initUser();
           core.back();
        

       }
       
    }

    async  function initUinfo(){
        let res = await core.user();
        let user = res.data;
        core.log('user---------------------');
        core.log(user);
        $api.val($api.dom('.ali'),user.ali)
        $api.val($api.dom('.cname'),user.cname)
        $api.val($api.dom('.nname'),user.name)
        $api.val($api.dom('.addr'),user.street)
        // $api.attr ( $api.dom('.userface'),'src' , user.avatar);
        
    }

    async function  saveFace( base64data ){
        var dt = {b:base64data };
   
     
        let res = await core.post("app/uploadface" , dt );
        core.log(res);
        core.log({});
    }
    
    function editFace(){
        console.log("start editface" );
        let that5 = core;
        api.getPicture({
           
           encodingType: 'jpg',
           mediaValue: 'pic',
  
           allowEdit: false,
           quality: 70,
           targetWidth: 200,
           targetHeight: 200,
           destinationType:'base64',
           saveToPhotoAlbum: false
       }, function(ret, err) {
       
           if (ret) {
            that5.log(ret);
              $api.attr($api.dom(".userface") , 'src', ret.base64Data);
               console.log("upload file ");
               saveFace(ret.base64Data);
               
               api.alert({
                        msg:'头像上传成功.'
                });
               core.initUser();
         core.back();

           } else {
               api.alert({
                   msg:JSON.stringify(err)
               });
           }
       });
    }

    function isMobile(str) {
        var mobileReg = /^1(3[0-9]|4[0-9]|5[0-9]|6[0-9]|7[0-9]|8[0-9]|9[0-9])\d{9}$/;
        return mobileReg.test(str);
    }

   async   function fnDelete(obj){
 
        let id = htmldata.dt.id ;
        var dt = {id : id };
        core.log(htmldata.dt  );
        let res = await    core.post("api/tuser/userDataDelete",dt );
        core.log(res);
         api.toast({   msg: '删除成功.'});
         api.execScript({
                    name: 'address',
                    script: 'getData();'
                });
         api.closeWin();
    }

</script>

</html>